import { Router, Route, Link, BrowserRouter, Switch, useHistory } from 'react-router-dom'
import { React, useEffect, useState } from 'react';
import { Layout, Menu, Breadcrumb, Space } from 'antd';
import { Redirect } from 'react-router'
import SubjectOneTest from './subjectOneTest'
import { checkLogin } from '../../utils/loginUtils/loginMethod'
import { message, Button } from 'antd';
import { Card, Avatar } from 'antd';
import { UserOutlined } from '@ant-design/icons';
import { EditOutlined, EllipsisOutlined, SettingOutlined } from '@ant-design/icons';
import { List, Typography, Divider } from 'antd';

export default () => {
    const { Text, Link } = Typography;
    const { Meta } = Card;
    const userInfo = [
        `考生号：${localStorage.getItem('username') || sessionStorage.getItem('username')}`,
        `考试科目：科目一`,
        `考试类型：${sessionStorage.getItem('examType')}`,
    ];
    const getExamTyep = () => {
        const examType = sessionStorage.getItem('examType')
        if (examType == 0) {
            sessionStorage.setItem("examType", "小车")
        }
        else if (examType == 1) {
            sessionStorage.setItem("examType", "货车")
        }
        else {
            sessionStorage.setItem("examType", "客车")
        }
    }
    const Description = () => {

        return (
            <>
                <Space
                    style={{ marginTop: 0 }}
                    direction='vertical'
                >
                    <List
                        size="small"
                        dataSource={userInfo}
                        renderItem={item => <List.Item>{item}</List.Item>}
                    />


                </Space>

            </>
        )

    }

    return (
        // 用户信息展示组件
        <Space
            direction="vertical"
        >
            <Card
                title='考生信息'
                style={{ width: 300 ,height:400}}

            // cover={
            //     <img
            //         alt="example"
            //         src="https://gw.alipayobjects.com/zos/rmsportal/JiqGstEfoWAOHiTxclqi.png"
            //     />
            // }
            // actions={[
            //     <SettingOutlined key="setting" />,
            //     <EditOutlined key="edit" />,
            //     <EllipsisOutlined key="ellipsis" />,
            // ]}
            >
                <Meta
                    avatar={<Avatar size={32} icon={<UserOutlined />} />}
                    title={localStorage.getItem('trueName') || sessionStorage.getItem('trueName')}
                    description={<Description />}
                />
            </Card>
            <Card
                title='注意事项与说明'
                style={{ width: 300 ,height:310}}
            >
                <Space
                    direction="vertical"
                >
                    <Text type="danger">1、考试倒计时结束自动提交</Text>
                    <Text type="danger">2、右上角为整体进度</Text>
                    <Text type="danger">3、绿色为作答正确，红色为作答错误</Text>
                </Space>

            </Card>
        </Space>
    )
}